<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>VIP客服页面</title>
  <link rel="stylesheet" href="/static/css/vip.css">
</head>
<body>
  <div class="container" id="container">
    <!-- <header class="section_header">BTGO手游</header> -->
    <main class="main">
      <div class="section_content">
        <div class="box">
          <div class="box_title"><?php echo $info['name']; ?></div>
          <input type="hidden" id="img_base64" value="<?php echo $info['img_base64'];?>">
          <img class="box_code" src="<?php echo $info['short_link_info']['code_url']; ?>" />
        </div>
        <div class="operation">
          <div class="row_item save" id="save" onclick="handleSave()">
            保存至相册
            <img class="icon" src="/static/images/icon_save.png" />
          </div>
          <div class="row_item share" id="share" onclick="handeShare()">
            分享到微信
            <img class="icon" src="/static/images/icon_share.png" />
          </div>
          <div class="row_item copy" id="copy" onclick="handleCopy()">
            复制链接
            <img class="icon" src="/static/images/icon_copy.png" />
          </div>
        </div>
      </div>
      <footer class="section_bottom">
        <div class="tip">
          <p>添加方式说明： </p>
          <p>1.截图保存二维码，打开微信扫一扫识别添加客服。</p>
          <p>2.复制链接到微信打开，长按识别二维码添加客服。</p>
          <p>3.分享至微信快速识别二维码添加客服。</p>
        </div>
        <!-- <img class="desc_thumb" src="" /> -->
      </footer>
    </main>

    <div class="container_fixed" id="toast_container">
      <div class="toast" id="toast">保存成功</div>
    </div>
  </div>


  <script>
    (function (win) {
      // rem配置
      var doc = win.document;
      var docEl = doc.documentElement;
      var tid;

      function refreshRem() {
        var width = docEl.getBoundingClientRect().width;
        // if (width > 540) { // 最大宽度
        //     width = 540;
        // }
        var rem = width / 7.5;
        docEl.style.fontSize = rem + "px";

      }

      win.addEventListener(
        "resize",
        function () {
          clearTimeout(tid);
          tid = setTimeout(refreshRem, 300);
        },
        false
      );
      win.addEventListener(
        "pageshow",
        function (e) {
          if (e.persisted) {
            clearTimeout(tid);
            tid = setTimeout(refreshRem, 300);
          }
        },
        false
      );

      refreshRem();
    })(window);
  </script>
  <script src="/static/js/btgo.js?v=1.0.7"></script>
  <script src="/static/js/clipboard.min.js"></script>

  <script>
    const img_base64 = document.getElementById('img_base64').value
    let payload = {}
    var btgoSDK = null
    var isSDK = false
    window.onload = () => {
      try {
        btgoSDK = new BTGOSdk() || null;
        isSDK = !!btgoSDK.btgo;
        var android = typeof BTGO != "undefined"; // 是否是安卓环境
        const inapp = (btgoSDK.isRunInApp && btgoSDK.isRunInApp()) || false
        // 客户端的盒子
        if(android) {
          payload = JSON.parse(btgoSDK.getCommonParam());
          if(inapp) { // 盒子内
            const hasShare = (btgoSDK.hasShareConfig && btgoSDK.hasShareConfig()) || false
            if(!hasShare) document.getElementById('share').style.display = 'none'
          } else {
            // sdk打开的盒子
            document.getElementById('share').style.display = 'none'
            if(payload.sdkversioncode*1 < 3181)  document.getElementById('save').style.display = 'none'
          }
        } else {
          // ios SDK
          btgoSDK.getCommonParam()
          document.getElementById('share').style.display = 'none'
        }
      } catch (error) {
        // h5环境
        document.getElementById('share').style.display = 'none'
        document.getElementById('save').style.display = 'none'
      }
    };

    /* 保存至相册 */
    function handleSave() {
      /* 传base64位的图片 */
      btgoSDK.saveImage(img_base64);
    }

    /* 分享至微信 */
    function handeShare() {
      /* 传base64位的图片 */
      let params = {
        app: 'wx',
        url: img_base64
      };
      btgoSDK.shareImage(params);
    }

    /* 复制链接*/
    function handleCopy() {
      let text = window.location.href

      if(isSDK) {
        btgoSDK.copyText(text);
      } else {
        var clipboard = new ClipboardJS('#copy', {
          text: function() {
            return text;
          }
        });

        /*复制成功*/
        clipboard.on('success', function(e) {
          showToast('复制成功')
          event.stopPropagation()
        });
        /*复制出现失败的情况下*/
        clipboard.on('error', function(e) {
          showToast('复制失败')
          event.stopPropagation()
        });
      }
    }

    /* 展示toast提示 */
    function showToast(text) {
      const toast = document.getElementById('toast_container');
      const toastEl = document.getElementById('toast');
      toastEl.innerHTML = text;
      toast.classList.add('show');
      // 2秒后消失
      setTimeout(function() {
        toast.classList.remove('show');
      }, 2000);
    }
  
    //苹果获取getPublickParam
    function getUserInfo(data) {
      payload = 
        typeof data == "string" ? JSON.parse(data.replace(/[\r\n]/g, "")) : JSON.parse(data);
      if(payload.sdkversioncode*1 < 3181)  document.getElementById('save').style.display = 'none'
    }
  
  </script>

</body>
</html>
